<template>
  <div class="app-container">
    <el-tabs
      v-model="activeName"
      type="border-card"
    >
      <el-tab-pane label="号码分组" name="grouping"><Grouping v-if="activeName === 'grouping'" /></el-tab-pane>
      <el-tab-pane label="导入号码" name="importNum"><ImportNum v-if="activeName === 'importNum'" /></el-tab-pane>
      <el-tab-pane label="派码记录" name="assignNumber"><AssignNumber v-if="activeName === 'assignNumber'" /></el-tab-pane>
    </el-tabs>
  </div>
</template>

<script setup>
import Grouping from './grouping/index.vue'
import ImportNum from './importNum/index.vue'
import AssignNumber from './assignNumber/index.vue'
import useToggle from "@/hooks/useToggle";
const [activeName, _, setActiveName] = useToggle('grouping');
</script>
